import { Component } from '@angular/core';
import * as $ from 'jquery';

@Component({
    
    selector: 'app-home',
    templateUrl: './home.component.html',
    styleUrls: ['./home.component.css']
})

export class homeComponent { 
  isCollapsed = false;
  ngOnInit() { 
//     var startX,startY,moveX, moveY,infoX,infoY,isDraw,topX,leftY,isMove;
//     //切换是否可以绘画
//     $('.checkbox').click(function () {
//         isDraw=true;
//         $("#father").css({"display":"block"})
//     });


//     //鼠标按下之后作判断
//     $(document).on('mousedown', function (e) {
//         console.log(e.target);
//         if(isDraw && e.target.id==="father"){
//             startX= e.offsetX;
//             startY= e.offsetY;
//             console.log(1);
//             $('#father').append($('<div id="son"></div>'));
//             $('#father>div').css({"position":"absolute","border":'1px solid #ccc',"top":startY,"left":startX,"background":"rgba(112,112,344,.3)"});
//         }else if(e.target.id.includes("son")&& !isDraw){
//             isMove=true;
//             infoX= e.offsetX;
//             infoY= e.offsetY;
//             console.log(e.target.id);
//         }





//     });
//     //鼠标在画布上移动
//     $(document).on('mousemove', function (e) {
//         if( isDraw && e.target.id==="father"){
//             moveX= e.offsetX-startX;
//             moveY= e.offsetY-startY;
//             $('#father>div').css({"width":moveX,"height":moveY})
//         }else if(e.target.id.includes("son")&& isMove){
//             topX= e.pageX- infoX-$('#fathers')[0].offsetLeft;
//             leftY= e.pageY-infoY-$('#fathers')[0].offsetTop;
//             console.log(e.target.id);
//             $("#"+e.target.id).css({'top':leftY,'left':topX})
//         }

//     });

//     //鼠标在画布上起来
//     $(document).on('mouseup', function (e) {
//       console.log(e.target);
      
//         if(e.target.id.includes("son")){
//             console.log("jing");
//             isMove=false;
//             isDraw=false;
//             $(".checkbox").prop("checked",false);
//             //新增到机房里面
//             var X=e.target.offsetLeft;
//             var Y=e.target.offsetTop;
//             var height=e.target.offsetHeight;
//             var width=e.target.offsetWidth;
//             var id=Math.round(Math.random()*100);
//             if(e.target.id.includes('son_')){
//                 return;
//             }
//             $("#fathers").append($("<div class='son' id=son_"+id+" style='width:"+width+"px;height:"+height+"px;position:absolute;top:"+Y+"px;left:"+X+"px'>son_"+id+"</div>"))
// //            $("#fathers").append($('<div class="son" id="2" style="width: 100px;height:100px;position: absolute;top: 20px;left: 20px"></div>'));
//             $("#father>div").remove();
//             $("#father").css({"display":"none"})
//         }
//         console.log(isDraw);
//     });

//     $(document).on('dblclick',function (e) {
//         console.log("dblcilck");
//         if(e.target.id.includes("son_")){
//             window.location.href="./home3.html"
//         }
//     })


  }
}